<template>
    <div id="loading">
        <topComponent></topComponent>
        <el-container>
            <el-main style="margin-top: 10%;">
                <h1>
                    感谢您参与我们的行为决策实验！
                    请您耐心等待<span style="color:red">{{least_time}}</span>秒！
                </h1>
                <el-progress style="margin-top: 10%;" :text-inside="true" :stroke-width="40" :percentage="calculate_percentage()"/>
            </el-main>
            
        </el-container>
        <bottomComponent></bottomComponent>
    </div>
</template>
  
<script>
import topComponent from '../components/top-component.vue'
import bottomComponent from '../components/bottom-component.vue'
import Vue from 'vue'
export default {
    name: 'loading',
    components:{
        topComponent,
        bottomComponent
    },
    data(){
        return{
            'least_time':5,
            timer:null
        }
    },
    methods:{
        calculate_least_time(){
            if(this.least_time ==0){
                clearInterval(this.timer)
                this.$router.push('/platform')
            }
            this.least_time --;
        },
        calculate_percentage(){
            return (5 - this.least_time) * 20
        },
        data_init(){
            let testee_id = window.sessionStorage.getItem('testee_id')
            let seat_sno = window.sessionStorage.getItem('seat_sno')
            this.$axios.post('/test/verifyTesteeInfoAndGetExperimentConfig',{
                "testeeId":testee_id,
                "seatSno":seat_sno
            }).then(res =>{
                if(res.data.code == 0){
                    Vue.prototype.$global_data = res.data.data
                    Vue.prototype.$global_data.decision_making_index = 1
                    Vue.prototype.$global_data.sub_experiment = []
                    this.timer = setInterval(this.calculate_least_time,1000)
                }else{
                    const h = this.$createElement;
                    this.$message({
                            message: h('p', null, [
                                h('span', null, '没有找到匹配的实验！'),
                            ])
                    });
                    clearInterval(this.timer)
                    this.$router.push('/')
                }
                
            })
        }
    },
    mounted(){
        this.data_init()
    },
    beforeDestroy(){
        clearInterval(this.timer)
    }
}
</script>
<style>
#loading{
    width: 100%;
    height: 100%;
    position: absolute;
}
</style>